<template>
  <button
    type="button"
    class="BtnTb fs14 ml5 mr5"
    :class="type"
    @click="emitClick($event)">
    <slot></slot>
  </button>
</template>

<script type="text/ecmascript-6">
  // table操作栏使用的常规按钮、部分地方亦可用
  export default {
    props: {
      type: {
        // `'base'` / `'warn'`
        type: String,
        default: 'base',
        validator: val => ['base', 'warn'].includes(val)
      }
    },
    methods: {
      emitClick ($event) {
        this.$emit('click', $event)
      }
    }
  }
</script>

<style scoped rel="stylesheet/scss" type="text/scss" lang="scss">
  @import '~@/assets/css/public.scss';

  .BtnTb {
    border: 0px;
    background: transparent none;
    &.base {
      @extend .c-btn-link;
    }
    &.warn {
      @extend .c-main;
    }
    &.info {
      @extend .c-333;
    }
  }
</style>
